<template>
  <div>
    <span>用户名字</span>
    <!-- .trim把页面的value值，字符串两边的空格去除 -->
    <input v-model.trim="username" type="text" />
    <!-- <input v-model="username" type="text" /> -->
    <br />
    <span>用户密码</span>
    <!-- lazy在change事件实现的，value值改变实时同步给vue变量 -->
    <input v-model.lazy="password" type="text" />
    <!-- <input v-model="password" type="text" /> -->
    <br />
    <span>年龄</span>
    <!-- .number把页面字符串数字，转成数值类型 -->
    <input v-model.number="age" type="text" />
    <input v-model="age" type="text" />
    <br />
  </div>
</template>

<script>

export default {

  data () {
    return {
      username: "",
      password: '',
      age: 0


    }
  }
}
</script>

<style>
</style>